<template>
    <div class="common-layout">
      <el-container>
        <el-header ><h1 style="background-color: #62b5ec; color:#fff;" >后台管理系统</h1></el-header>
        <el-container>
          <el-aside width="200px">
            <el-menu text-color="#00a1ed" active-text-color="red" style="margin-left: 20px"  >
              <el-menu-item index="1" >员工管理</el-menu-item>
              <el-menu-item index="2">轮播图管理</el-menu-item>
              <el-menu-item index="3">商品管理</el-menu-item>
            </el-menu>
          </el-aside>
          <el-main>
            <el-table :data="personList">
              <el-table-column label="编号" type="index" width="100"></el-table-column>
              <el-table-column label="姓名" prop="name"></el-table-column>
              <el-table-column label="年龄" prop="age"></el-table-column>
              <el-table-column label="性别" prop="gender"></el-table-column>
              <el-table-column label="手机" prop="phone"></el-table-column>
              <el-table-column label="地址" prop="address"></el-table-column>

            </el-table>
          </el-main>
        </el-container>
      </el-container>
    </div>
</template>


<script setup>
import {ref} from "vue";
const personList=ref([{
  name:'张飞',
  age:'18',
  gender:'男',
  phone:'19199991111',
  address:'地球村'
},
  {
    name:'张飞',
    age:'18',
    gender:'男',
    phone:'19199991111',
    address:'地球村'
  },
  {
    name:'张飞',
    age:'18',
    gender:'男',
    phone:'19199991111',
    address:'地球村'
  },
]);
const person=ref({
  name:'',
  age:'',
  gender:'',
  phone:'',
  address:''
})
</script>

<style scoped>

</style>